<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.prime.com.tr/ui" template="./template.xhtml">

	<ui:define name="main">
		<h:form id="usuarioForm">
			<center>
				<p:panel id="painelCadastro" header="Cadastrar novo usuario"
					style="text-align:left;width:700px;">

					<h:panelGroup columns="2">
						<h:outputLabel value="Grupo: " />
						<h:selectOneMenu value="#{usuarioBean.idGrupo}"
							style="margin-left: 30px;">
							<f:selectItem itemLabel="Selecione" />
							<f:selectItems value="#{usuarioBean.listaGrupo}" />
						</h:selectOneMenu>
						<h:outputLabel value="Perfil: " style="margin-left: 20px;" />
						<h:selectOneMenu value="#{usuarioBean.idPerfil}">
							<f:selectItem itemLabel="Selecione" />
							<f:selectItems value="#{usuarioBean.listaPerfil}" />
						</h:selectOneMenu>
					</h:panelGroup>

					<h:panelGrid columns="2" style="margin-top: 5px;">
						<h:outputLabel value="Nome: " />
						<h:inputText id="nome" value="#{usuarioBean.usuario.nome}"
							size="60" />

						<h:outputLabel value="Telefone: " />
						<h:inputText id="telefone" value="#{usuarioBean.usuario.telefone}"
							size="60" />

						<h:outputLabel value="Email: " />
						<h:inputText id="email" value="#{usuarioBean.usuario.email}"
							size="60" />


						<h:outputLabel value="Login: " />
						<h:inputText id="login" value="#{usuarioBean.usuario.login}"
							size="60" />

						<h:outputLabel value="Password: " />
						<h:inputText id="password" value="#{usuarioBean.usuario.password}"
							size="60" />
					</h:panelGrid>
					<br />
					<h:messages style="color:red" showDetail="false" />
					<center>
						<p:commandButton value="Gravar" action="#{usuarioBean.gravar}"
							update="painelConsulta, painelCadastro" />
						<p:commandButton value="Limpar" action="#{usuarioBean.limpar}"
							update="painelCadastro" />
					</center>
				</p:panel>
				<br />
				<h:messages style="color:red" showDetail="false" />
				<!-- Lista de usuarios -->
				<p:panel id="painelConsulta" header="Lista de usuarios cadastrados"
					style="text-align:left;width:700px;">

					<p:dataTable value="#{usuarioBean.listaUsuarios}" id="tabela"
						emptyMessage="Nenhum registro encontrado" rowIndexVar="var"
						paginator="true" paginatorPosition="bottom"
						firstPageLinkLabel="Primeira" previousPageLinkLabel="Anterior"
						nextPageLinkLabel="Proxima" lastPageLinkLabel="ultima" rows="5"
						var="usuario" width="600">

						<p:column>
							<f:facet name="header">
								<h:outputText value="ID" />
							</f:facet>
							<h:outputText value="#{usuario.id}" styleClass="letra1" />
						</p:column>

						<p:column>
							<f:facet name="header">
								<h:outputText value="Nome" />
							</f:facet>
							<h:outputText value="#{usuario.nome}" styleClass="letra1" />
						</p:column>

						<p:column>
							<f:facet name="header">
								<h:outputText value="Telefone" />
							</f:facet>
							<h:outputText value="#{usuario.telefone}" styleClass="letra1" />
						</p:column>

						<p:column>
							<f:facet name="header">
								<h:outputText value="Email" />
							</f:facet>
							<h:outputText value="#{usuario.email}" styleClass="letra1" />
						</p:column>

						<p:column style="width:10px;">
							<p:commandButton image="ui-icon-pencil" title="Alterar"
								update="usuarioForm">
								<f:setPropertyActionListener target="#{usuarioBean.usuario}"
									value="#{usuario}" />
							</p:commandButton>
						</p:column>

						<p:column style="width:10px;">
							<p:commandButton action="#{usuarioBean.excluir}"
								image="ui-icon-close" title="Excluir" update="usuarioForm">
								<f:setPropertyActionListener target="#{usuarioBean.usuario}"
									value="#{usuario}" />
							</p:commandButton>
						</p:column>
					</p:dataTable>
				</p:panel>
			</center>
		</h:form>
		<br />
	</ui:define>
</ui:composition>
